<template>
  <div class="app-container">
    <div>
      <!-- 条件栏 -->
      <div class="filter-wrapper">
        <page-filter
          v-model:query="filterInfo.query"
          :filter-list="filterInfo.list"
        >
          <template v-slot:filter-productId>
            <el-input
              type="input"
              :disabled="true"
              class="not-mongolia"
              placeholder="请选择耗材"
              v-model="product"
            >
              <template #append>
                <el-icon @click="openProductWindow('filter')"
                  ><MoreFilled
                /></el-icon>
              </template>
            </el-input>
          </template>
        </page-filter>
        <div class="display-flex">
          <el-button @click="refresh">更新项目</el-button>
          <el-button @click="save">保存</el-button>
        </div>
      </div>

      <el-form :model="tableInfo" ref="tableForm" style="width: 100%">
        <!-- 表格 -->
        <table-container
          :refresh="tableInfo.refresh"
          :init-curpage="tableInfo.initCurpage"
          v-model:data="tableInfo.data"
          :api="tableInfo.api"
          :check-box="false"
          :tab-index="true"
          :query="filterInfo.query"
          :field-list="tableInfo.fieldList"
          @handleEvent="handleEvent"
        >
          <template v-slot:col-commonName="scope">
            <el-input
              type="input"
              :disabled="true"
              class="not-mongolia"
              placeholder="请选择"
              v-model="scope.row.commonName"
            >
              <template #append>
                <el-icon @click="openProductWindow('table', scope.$index)"
                  ><MoreFilled
                /></el-icon>
              </template>
            </el-input>
          </template>
        </table-container>
      </el-form>
    </div>
    <!-- 选择产品 -->
    <NewSelectProduct
      v-if="productInfo.visible"
      v-model:show-dialog="productInfo.visible"
      :checkBox="false"
      :highlightRow="true"
      :query="productInfo.query.queryMap"
      :query-params="productInfo.query.queryParams"
      :api="productInfo.api"
      :notDefaultProductSupplier="true"
      :table-key="productInfo.tableKey"
      :saveEmpty="true"
      @callback="selectProductCallback"
    />
  </div>
</template>

<script setup name="lisProject">
import PageFilter from '@/components/PageFilter/index'
import TableContainer from '@/components/TableContainer/index'
import { getProductCustomizeList } from '@/api/core'
import {
  getLisProjectPage,
  batchUpdateLisProject,
  refreshLisProject,
} from '@/api/lis.js'
import PageForm from '@/components/PageForm/index'
import PageDialog from '@/components/PageDialog/index'

const { proxy } = getCurrentInstance()
const emit = defineEmits()

const NewSelectProduct = defineAsyncComponent(() =>
  import('@/components/NewSelectProduct/index')
)

const product = ref('')
const clickRowIndex = ref('')
const openType = ref('')
// 过滤相关配置
const filterInfo = reactive({
  query: {
    sort: 'project_code desc',
    productId: '',
  },
  list: [
    {
      type: 'input',
      label: '请输入项目名称',
      value: 'projectNameLike',
      event: search,
    },
    {
      type: 'input',
      label: '请输入项目编码',
      value: 'projectCodeLike',
      event: search,
    },
    {
      type: 'slot',
      value: 'productId',
      event: search,
    },
    { type: 'button', label: '搜索', event: search },
  ],
})
// 表格相关
const tableInfo = reactive({
  refresh: 1,
  initCurpage: 1,
  data: [],
  api: undefined,
  selections: [],
  fieldList: [
    { label: '项目名称', value: 'projectName' },
    { label: '项目编码', value: 'projectCode' },
    { label: '耗材', value: 'commonName', type: 'slot' },
  ],
})
//选择产品相关
let productInfo = reactive({
  visible: false,
  api: getProductCustomizeList,
  tableKey:
    'productPageForLisProject-com.slip.spd.entity.vo.core.CoreProductVONew',
  query: {
    queryMap: {
      id: {
        queryType: 'NOT_IN',
        queryCategory: 'AND',
        value: null,
      },
      status: {
        queryType: 'EQUALS',
        queryCategory: 'AND',
        value: null,
      },
      orderId: {
        queryType: 'EQUALS',
        queryCategory: 'AND',
        value: null,
      },
      supplierId: {
        queryType: 'EQUALS',
        queryCategory: 'AND',
        value: null,
      },
      productId: {
        queryType: 'NOT_IN',
        queryCategory: 'AND',
        value: null,
      },
      type: {
        asTbName: 'core_product_new',
        columnName: 'type',
        queryResource: 0,
        queryType: 'EQUALS',
        queryCategory: 'AND',
        value: 0,
      },
    },
    queryParams: {
      checkDeptProduct: 1,
    },
  },
  searchList: [],
})

onMounted(() => {
  tableInfo.api = getLisProjectPage
  getList()
})

function save() {
  //保存
  batchUpdateLisProject(tableInfo.data).then((res) => {
    if (res && res.success) {
      getList()
    }
  })
}
function refresh() {
  //刷新
  refreshLisProject().then((res) => {
    if (res && res.success) {
      getList()
    }
  })
}
function selectProductCallback(data) {
  if (openType.value === 'filter') {
    if (data) {
      product.value = data.commonName
      filterInfo.query.productId = data.id
    } else {
      product.value = ''
      filterInfo.query.productId = ''
    }
  } else {
    let index = clickRowIndex.value
    if (data && data.id) {
      tableInfo.data[index]['productId'] = data.productId
      tableInfo.data[index]['commonName'] = data.commonName
    } else {
      tableInfo.data[index]['productId'] = -2
      tableInfo.data[index]['commonName'] = ''
    }
  }
}
function openProductWindow(str, index) {
  openType.value = str
  if (str === 'filter') {
    productInfo.visible = true
  } else {
    clickRowIndex.value = index
    productInfo.visible = true
  }
}
// 获取列表
function getList() {
  tableInfo.refresh = Math.random()
}

// 搜索
function search() {
  // 重置分页
  tableInfo.initCurpage = Math.random()
  tableInfo.refresh = Math.random()
}

// 触发事件
function handleEvent(event, data) {
  switch (event) {
    // 对表格获取到的数据做处理
    case 'tableCheck':
      tableInfo.selections = data
      break
  }
}
</script>

<style scoped></style>
